// component/pickerView.js
Component({
  /**
   * 组件的属性列表
   */
  properties: {
    range: {
      type: Array,
      value: []
    },
    mode: {
      type: String,
      value: 'selector'
    },
    type: {
      type: String,
      value: ''
    },
    pickerColumn: Boolean
  },

  /**
   * 组件的初始数据
   */
  data: {
    pickerValue: 0,
    column: 0,
    value: 0,
    salaryArr: [],
    picker: false,
    pickerList: [],
    startValue: null,
    endValue: null,
    startIndex: -1,
    endIndex: 0
  },

  /**
   * 组件的方法列表
   */
  methods: {
    columnEvent() {
      if (this.data.mode == 'columnSelector') {
        this.pickerColumnSelectorChange({ detail: { value: [0, 0] } })
        return this.setData({ picker: true })
      }
      this.setData({ picker: true, startIndex: 0, pickerList: this.data.range })
    },
    cancelEvent() {
      this.setData({ picker: false })
      this.triggerEvent("cancel")
    },
    confirmEvent() {
      switch (this.data.mode) {
        case 'selector':
          this.selectorConfirm()
          break;
        case 'multiSelector':
          this.multiSelectorConfirm()
          break;
        case 'columnSelector':
          this.columnSelectorConfirm()
          break;
      }
      this.cancelEvent()
    },
    /**
     * 单列确定事件
     */
    selectorConfirm() {
      const { pickerList, startIndex, mode, range } = this.data
      const list = JSON.parse(JSON.stringify(range));
      const startValue = list[startIndex]
      this.triggerEvent("change", {
        mode,
        startValue,
        startIndex,
        list: pickerList,
        value: [startValue],
        index: [startIndex]
      })
    },
    /**
     * 多列确定事件
     */
    multiSelectorConfirm() { },
    /**
     * 多列拼接确定事件
     */
    columnSelectorConfirm() {
      const { pickerList, startIndex, endIndex, mode } = this.data
      const list = JSON.parse(JSON.stringify(pickerList));
      const [startArr, endArr] = [list.shift(), list.pop()];
      const [startValue, endValue] = [startArr[startIndex], endArr[endIndex]]
      this.triggerEvent("change", {
        startValue, endValue, startIndex, endIndex, mode,
        list: pickerList,
        value: [startValue, endValue],
        valueList: [startValue, '-', endValue],
        index: [startIndex, endIndex]
      })
    },
    /**
     * picker 变化事件
     */
    pickerChange(event) {
      switch (this.data.mode) {
        case 'selector':
          this.pickerSelectorChange(event)
          break;
        case 'multiSelector':
          this.pickerMultiSelectorChange(event)
          break;
        case 'columnSelector':
          this.pickerColumnSelectorChange(event)
          break;
      }
    },
    /**
     * 单列事件
     * selector
     */
    pickerSelectorChange(event) {
      const list = JSON.parse(JSON.stringify(this.data.range));
      const startIndex = event.detail.value.shift();
      const startValue = list[startIndex]
      this.setData({ startValue, startIndex })
    },
    /**
     * 多列事件
     * multiSelector
     */
    pickerMultiSelectorChange(event) { },
    /**
     * 多列拼接事件
     * columnSelector
     */
    pickerColumnSelectorChange(event) {
      const { startIndex: index } = this.data
      const list = JSON.parse(JSON.stringify(this.data.range));
      const listIndex = event.detail.value;
      let [startArr, endArr] = [list.shift(), list.pop()];
      let [startIndex, endIndex] = [listIndex.shift(), listIndex.pop()];
      let [startValue, endValue] = [startArr[startIndex], endArr[endIndex]]
      let newEndArr = endArr.filter((item, index) => index >= startIndex)
      if (index != startIndex) {
        endIndex = 0
        endValue = newEndArr[endIndex]
      }
      const pickerList = [startArr, ['-'], newEndArr]
      this.setData({ pickerList, startValue, endValue, startIndex, endIndex })
    }
  },
  /**
   * 生命周期
   * 在组件实例进入页面节点树时执行
   */
  lifetimes: {
    attached: function () {
      if (this.data.pickerColumn) this.columnEvent()
    }
  }
})